<template>
  <h4>基础用法</h4>
  <Base>
    <template #default="scope">
      <!-- 页面代码 源码 -->
      <dropWrap key="oreo">
        <pre><code class="language-js">{{ scope.html }}</code></pre>
      </dropWrap>
      <!-- 页面代码 源码 -->
    </template>
  </Base>
  <h4>自定义图片</h4>
  <Custom>
    <template #default="scope">
      <!-- 页面代码 源码 -->
      <dropWrap key="oreo">
        <pre><code class="language-js">{{ scope.html }}</code></pre>
      </dropWrap>
      <!-- 页面代码 源码 -->
    </template>
  </Custom>
</template>

<script setup lang="ts">
import { onMounted, nextTick } from "vue";

import Base from "./Base.vue";
import Custom from "./Custom.vue";

import dropWrap from "../../dropWrap.vue";

import Prism from "prismjs";

onMounted(() => {
  nextTick(() => {
    Prism.highlightAll();
  });
});
</script>

<style scoped lang="scss"></style>
